<template>
  <div class="navbar">
    <div class="nav-left" @click="back">
      <slot name="left">
        <i class="iconfont icon-back"></i>
        <span class="title"><slot></slot></span>
      </slot>
    </div>
    <div class="nav-right"><slot name="right"></slot></div>
  </div>
</template>
<script>
export default {
  name: "index",
  data() {
    return {}
  },
  computed: {},
  methods: {
    back() {
      this.$router.back()
    }
  },
  created() {
  },
  watch: {}
}
</script>

<style scoped lang="scss">
.navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  .nav-left {
    font-size: 18px;
    color: #000;
    font-weight: bold;
    cursor: pointer;
    i {
      font-size: 20px;
      vertical-align: -1px;
    }
  }
}
</style>
